<template>
  <div class="pre-recorded">
    <x-header>预录</x-header>
    <group title="箱信息" label-width="140px">
      <cell title="箱号">{{container.ctnno}}</cell>
      <cell title="冷藏箱温度">{{container.temperature}}</cell>
      <cell title="冷藏箱温度单位">{{container.temperatureUnit}}</cell>
      <!--<selector title="冷藏箱温度单位" :options="temperatureUnitList" v-model="container.temperatureUnit"></selector>-->
      <x-input title="最低温度" v-model="container.minTemperature" placeholder="可以不填"></x-input>
      <x-input title="最高温度" v-model="container.maxTemperature" placeholder="可以不填"></x-input>
      <cell title="危险品等级">{{container.dngLevel}}</cell>
      <x-input title="危险品代码" v-model="container.dngCode" placeholder="可以不填"></x-input>
      <cell title="危险品联合国编号">{{container.dngUno}}</cell>
      <x-input title="闪点" v-model="container.dngFlash" placeholder="可以不填"></x-input>
      <x-input title="危险品标签" v-model="container.dnglabel" placeholder="可以不填"></x-input>
      <x-input title="应急措施号" v-model="container.emergencyCode" placeholder="可以不填"></x-input>
      <x-input title="急救指南号" v-model="container.emergencyGuid" placeholder="可以不填"></x-input>
      <selector title="是否海运污染" :options="dngseaList" v-model="container.dngsea"></selector>
      <x-input title="前超" type="number" v-model="container.of" placeholder="可以不填"></x-input>
      <x-input title="后超" type="number" v-model="container.ob" placeholder="可以不填"></x-input>
      <x-input title="右超" type="number" v-model="container.or" placeholder="可以不填"></x-input>
      <x-input title="左超" type="number" v-model="container.ol" placeholder="可以不填"></x-input>
      <x-input title="超高" type="number" v-model="container.oh" placeholder="可以不填"></x-input>
      <cell title="船英文名">{{container.vslNO}}</cell>
      <cell title="航次">{{container.voyage}}</cell>
      <x-input title="IMO编码" v-model="container.imo" placeholder="可以不填"></x-input>
      <x-input title="船舶呼号" v-model="container.callid" placeholder="可以不填"></x-input>
      <cell title="进箱码头">{{container.termCD}}</cell>
      <cell title="尺寸箱型">{{container.sizeType}}</cell>
      <selector title="箱状态" :options="ctnStatusList" v-model="container.ctnStatus"></selector>
      <cell title="箱经营人代码">{{container.ctnOwner}}</cell>
      <cell title="箱经营人名称">{{container.ctnOwnerName}}</cell>
      <cell title="海关代码">{{container.customsCode}}</cell>
      <cell title="箱皮重">{{container.weight}}</cell>
      <datetime title="装箱时间" v-model="container.loadingTime" format="YYYY-MM-DD HH:mm"></datetime>
      <cell title="装船码头代码">{{container.loadingPortCD}}</cell>
      <cell title="装船码头名称">{{container.loadingPortName}}</cell>
      <cell title="卸货码头代码">{{container.unloadPortCD}}</cell>
      <cell title="卸货码头英文名称">{{container.unloadPortName}}</cell>
      <!--<cell title="封志信息"></cell>-->
      <x-input title="设备交接单" v-model="container.callid" placeholder="可以不填"></x-input>
      <selector title="运输方式" :options="transportList" v-model="container.transport"></selector>
      <cell title="装箱人">{{container.packer}}</cell>
      <cell title="装箱地址">{{container.packerAddress}}</cell>
    </group>
    <group title="铅封／封志" label-width="140px">
      <cell title="铅封／封志号">{{seal.sealNO}}</cell>
      <selector title="铅封／封志类型" :options="sealTypeList" v-model="seal.sealType"></selector>
      <selector title="铅封／封志人" :options="sealerList" v-model="seal.sealer"></selector>
    </group>
    <group title="货信息" label-width="140px">
      <cell title="提单号">{{good.billNO}}</cell>
      <x-input title="交货地代码" v-model="good.delieveLCode" placeholder="可以不填"></x-input>
      <x-input title="交货地名称" v-model="good.delieveLName" placeholder="可以不填"></x-input>
      <x-input title="货序号" type="number" v-model="good.index" placeholder="必填"></x-input>
      <cell title="货件数">{{good.nums}}</cell>
      <x-input title="包装类型代码" v-model="good.packageCode" placeholder="可以不填"></x-input>
      <x-input title="包装类型名称" v-model="good.packageName" placeholder="可以不填"></x-input>
      <cell title="货物重量">{{good.weight}}</cell>
      <cell title="货物尺寸">{{good.size}}</cell>
      <x-textarea v-model="good.desc" :max="200" placeholder="货物描述，必填"></x-textarea>
      <cell title="唛头">{{good.shippingMarks}}</cell>
      <x-input title="货代码" v-model="good.code" placeholder="可以不填"></x-input>
      <cell title="危险品等级">{{good.dngLevel}}</cell>
      <x-input title="危险品代码" v-model="good.dngCode" placeholder="可以不填"></x-input>
      <cell title="危险品联合国编号">{{good.dngUno}}</cell>
      <x-input title="闪点" v-model="good.dngFlash" placeholder="可以不填"></x-input>
      <x-input title="危险品标签" v-model="good.dngLabel" placeholder="可以不填"></x-input>
      <x-input title="应急措施号" v-model="good.dngEmergencyCode" placeholder="可以不填"></x-input>
      <x-input title="急救指南号" v-model="good.dngEmergencyGuide" placeholder="可以不填"></x-input>
      <x-input title="是否海运污染" v-model="good.dngSea" placeholder="可以不填"></x-input>
    </group>
    <box gap="15px">
      <x-button @click.native="submit" type="primary">确认预录</x-button>
    </box>
  </div>
</template>

<script>
import {
  XHeader,
  Box,
  Selector,
  Cell,
  XButton,
  Group,
  XInput,
  Datetime,
  XTextarea
} from 'vux'
import {
  presco
} from '../../api/api'
import moment from 'moment'
export default {
  name: 'preRecorded',
  components: {
    XHeader,
    Box,
    Selector,
    Cell,
    XButton,
    Group,
    XInput,
    Datetime,
    XTextarea
  },
  data () {
    return {
      container: {
        ctnno: '',
        temperature: '',
        temperatureUnit: 'C',
        minTemperature: '',
        maxTemperature: '',
        dngLevel: '',
        dngCode: '',
        dngUno: '',
        dngFlash: '',
        dnglabel: '',
        emergencyCode: '',
        emergencyGuid: '',
        dngsea: '',
        of: 0,
        ob: 0,
        or: 0,
        ol: 0,
        oh: 0,
        vslNO: '',
        voyage: '',
        imo: '',
        callid: '',
        termCD: '',
        sizeType: '',
        ctnStatus: '8',
        ctnOwner: '',
        ctnOwnerName: '',
        customsCode: '2200',
        weight: 0,
        loadingTime: moment(new Date()).format('YYYY-MM-DD HH:mm'),
        loadingPortCD: 'CNSHA',
        loadingPortName: 'SHANGHAI',
        unloadPortCD: '',
        unloadPortName: '',
        seals: [],
        eir: '',
        transport: '2',
        packer: '',
        packerAddress: ''
      },
      seal: {
        sealNO: '',
        sealType: 'E',
        sealer: 'AA'
      },
      good: {
        billNO: '',
        delieveLCode: '',
        delieveLName: '',
        index: '',
        nums: 0,
        packageCode: '',
        packageName: '',
        weight: 0,
        size: 0,
        desc: '',
        shippingMarks: '',
        code: '',
        dngLevel: '',
        dngCode: '',
        dngUno: '',
        dngFlash: '',
        dngLabel: '',
        dngEmergencyCode: '',
        dngEmergencyGuide: '',
        dngSea: ''
      },
      temperatureUnitList: [{key: 'C', value: 'C'}, {key: 'F', value: 'F'}],
      ctnStatusList: [{key: '8', value: '整箱'}, {key: '7', value: '拼箱'}, {key: '4', value: '空箱'}],
      transportList: [{key: '2', value: '公路直通'}, {key: '3', value: '内贸'}, {key: '1', value: '海铁联运'}, {key: '0', value: '无'}],
      dngseaList: [{key: '', value: '未知'}, {key: 'Y', value: '是'}, {key: 'N', value: '否'}],
      sealTypeList: [{key: 'E', value: '电子封志'}, {key: 'M', value: '机械封志'}],
      sealerList: [{key: 'AA', value: '拼箱人'}, {key: 'AC', value: '检疫'}, {key: 'CA', value: '承运人'}, {key: 'CU', value: '海关'}, {key: 'SH', value: '发货人'}, {key: 'TO', value: '码头'}, {key: 'AB', value: '未知'}],
      termCDList: [{key: 'W1', value: '外一'}, {key: 'W2', value: '外二'}, {key: 'W4', value: '外四'}, {key: 'W5', value: '外五'}, {key: 'Y1', value: '洋一'}, {key: 'Y3', value: '洋三'}, {key: 'Y4', value: '洋四'}]
    }
  },
  mounted () {
    const bussinessOrder = this.$router.currentRoute.query
    console.log(bussinessOrder)
    let ctnOwner = '' // 箱经营人代码
    let ctnOwnerName = '' // 箱经营人名称
    let unloadPortCD = '' // 卸货码头代码
    let unloadPortName = '' // 卸货码头英文名称
    if (bussinessOrder.theOperator !== '') {
      const ctn = bussinessOrder.theOperator.split('-')
      if (ctn.length !== 2) {
        this.$vux.toast.text('箱经营人数据不合法')
        return
      }
      ctnOwner = ctn[0]
      ctnOwnerName = ctn[1]
    }
    if (bussinessOrder.discharge !== '') {
      const unload = bussinessOrder.discharge.split('     ') // 小黄说的，5个空格
      if (unload.length !== 2) {
        this.$vux.toast.text('卸货码头数据不合法')
        return
      }
      unloadPortName = unload[0]
      unloadPortCD = unload[1]
    }
    // 填充字段值
    Object.assign(this.container, {
      ctnno: bussinessOrder.carton,
      temperature: String(bussinessOrder.temperature),
      dngLevel: bussinessOrder.level,
      dngUno: bussinessOrder.united,
      vslNO: bussinessOrder.boat,
      voyage: bussinessOrder.voyage,
      termCD: bussinessOrder.port,
      sizeType: bussinessOrder.type,
      ctnOwner: ctnOwner,
      ctnOwnerName: ctnOwnerName,
      weight: Number(bussinessOrder.tweight),
      unloadPortCD: unloadPortCD,
      unloadPortName: unloadPortName,
      packer: bussinessOrder.driverName,
      packerAddress: bussinessOrder.address
    })
    Object.assign(this.seal, {
      sealNO: bussinessOrder.titles
    })
    Object.assign(this.good, {
      billNO: bussinessOrder.blno,
      delieveLName: bussinessOrder.placeName,
      nums: Number(bussinessOrder.num),
      weight: Number(bussinessOrder.gweight),
      size: Number(bussinessOrder.size),
      shippingMarks: bussinessOrder.wheat,
      dngLevel: bussinessOrder.level
    })
  },
  methods: {
    submit () {
      if (this.container.ctnOwner === '' || this.container.ctnOwnerName === '') {
        this.$vux.toast.text('请联系车队添加箱经营人信息')
        return
      }
//      if (!/W1|W2|W4|W5|Y1|Y3|Y4/.test(this.container.termCD)) {
//        this.$vux.toast.text('进箱码头不在预录范围内')
//        return
//      }
      if (this.good.index === '') {
        this.$vux.toast.text('货序号必填')
        return
      }
      if (this.good.desc === '') {
        this.$vux.toast.text('请输入货物描述')
        return
      }
      let container = this.container
      let good = this.good
      container.loadingTime = moment(container.loadingTime).format('YYYY-MM-DD HH:mm:ss')
      container.seals.push(this.seal)
      good.index = Number(good.index)
      let params = {
        container: container,
        goods: [good]
      }
      presco(params).then(res => {
        if (res.status === 200) {
          this.$vux.toast.text('预录成功，请耐心等待通知')
          this.$router.go(-1)
        } else {
          this.$vux.toast.text(res.msg)
        }
      })
    }
  }
}
</script>

<style lang="less">
  .pre-recorded{
    .weui-cells{
      font-size: 13px;
    }
    .weui-cell{
      padding: 5px 10px;
    }
    .weui-cell:before{
      left: 10px;
    }
    .weui-select{
      height: 28px;
      line-height: 28px;
    }
    .vux-selector.weui-cell_select-after{
      padding-left: 10px;
    }
  }
</style>
